<html>
<head>
    <meta charset="UTF-8">
    <title>欢迎页面</title>
    <script src="./js/axios.min.js"></script>
</head>
<body>
<h2>Hello World!</h2>
<table border="1" cellspacing="0" width="100%" id="userTbale">

</table>

<script>
    //网页标签加载完后会触发onload事件，调用匿名函数
    window.onload=function (){
        axios.get("/JMS2301_03_javaWeb_war/queryAllUser").then(function (resp) {
            let users = resp.data;
            console.log(users)
            let tableData = " <tr>\n" +
                "        <th>uid</th>\n" +
                "        <th>用户名</th>\n" +
                "        <th>密码</th>\n" +
                "        <th>真实姓名</th>\n" +
                "        <th>年龄</th>\n" +
                "        <th>性别</th>\n" +
                "        <th>手机号</th>\n" +
                "        <th>操作</th>\n" +
                "    </tr>";

            //遍历users
            for (let i = 0; i < users.length; i++) {
                let user=users[i];
                tableData+="\n"+
                    " <tr>\n"+
                    "        <td>"+user.uid+"</td>\n" +
                    "        <td>"+user.username+"</td>\n" +
                    "        <td>"+user.password+"</td>\n" +
                    "        <td>"+user.realname+"</td>\n" +
                    "        <td>"+user.age+"</td>\n" +
                    "        <td>"+user.gender+"</td>\n" +
                    "        <td>"+user.phone+"</td>\n" +
                    "        <td><a href='#'>修改</a><a href='#'>删除</a></td>\n" +
                    "    </tr>";
            }
            //设置表格数据
            document.getElementById("userTbale").innerHTML=tableData;
        })
    }


</script>
</body>
</html>
